<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../../layui/css/layui.css">
    <script src="../../layui/layui.js"></script>
    <script src="../../js/jquery.min.js"></script>
    <link rel="stylesheet" href="../../layui/css/formSelects-v4.css">
    <script src="../../js/config.js"></script>
</head>
<body>

<h1>行业信息</h1>
<hr>
<form action="" class="layui-form">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">标题</label>
            <div class="layui-input-inline">
                <input type="text" id="inlogo" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">时间</label>
            <div class="layui-input-inline">
                <input type="text" id="intime" autocomplete="off" class="layui-input">
            </div>
        </div>
        <button type="button" class="layui-btn" onclick="reloadData()" lay-submit="" lay-filter="demo1">查询</button>
    </div>
</form>

<table class="layui-hide" id="userList" lay-filter="userList"></table>


<script>
    var table ;
    function reloadData(){
        //执行重载
        table.reload('userList', {
            page: {
                curr: 1 //重新从第 1 页开始
            }
            ,where: {
                inlogo : $("#inlogo").val(),
                intime: $("#intime").val()
            }
        });
    }

    layui.use('form',function () {
        var form = layui.form;
    });
    layui.use(['table','form'], function(){
        table = layui.table;
        var form = layui.form;

        table.render({
            elem: '#userList'
            ,url:'http://localhost:8888/industry/list'
            ,page: true
            ,even : true
            ,toolbar: '#tool'
            ,id : "userList"
            ,cols: [[
                 {field:'hello',type:'checkbox'}
                ,{field:'inid', title: '序号', sort: true}
                ,{field:'inlogo', title: '标题'}
                ,{field:'intext', title:'内容'}
                ,{field:'intime', title: '发布时间'}
                ,{fixed: 'right', title:'操作', toolbar: '#toolbarDemo', width:150}
            ]]
        });
    });
</script>
<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="update"><i class="layui-icon layui-icon-upload-drag"></i>修改</button>
        <button class="layui-btn layui-btn-sm" lay-event="del"><i class="layui-icon layui-icon-upload-drag"></i>删除</button>
    </div>
</script>
<script type="text/html" id="tool">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="add">添加</button>
        <button class="layui-btn layui-btn-sm" lay-event="batchDelete">批量删除</button>
    </div>
</script>
<script>
    var table ;
    layui.use(['form','table'],function(){
        table = layui.table;
        var form = layui.form;

        //头工具栏事件
        table.on('toolbar(userList)', function(obj){
            switch(obj.event){
                case 'batchDelete': //批量删除
                    //获取选中行
                    var checkStatus = table.checkStatus(obj.config.id);
                    var data = checkStatus.data;
                    if(data.length == 0){
                        layer.msg('请选择要删除的数据行');
                        return;
                    }
                    layer.confirm("确定要删除选中的数据吗？",function (index) {
                        var p = "?";
                        for(let industry of data){
                            p += `id=${industry.inid}&`;
                        }

                        $.post(`http://localhost:8888/industry/batchDelete${p}`,d => {
                            layer.close(index);
                            table.reload("userList");
                        });
                    })
                    break;
                case 'add':
                    $.get('IndustryAdd.html',function (data) {
                        layer.open({
                            title: '添加角色',
                            type:1,
                            anim:4,
                            skin:'layui-layer-molv',
                            area:'800px',
                            content:data,
                            maxmin:true,
                            btn : ['确定','取消'],
                            yes : function () {
                                var str = $("#add_user_form").serialize();
                                $.post(`${new Config().base_url}/industry/add`,str,function (data) {
                                    layer.close(layer.index);
                                    table.reload('userList');
                                });
                            }
                        });
                    });
                    break;
                case 'isAll':
                    layer.msg(checkStatus.isAll ? '全选': '未全选');
                    break;
            };
        });

        //监听行内的工具条
        table.on('tool(userList)',function (obj) {
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）

            if(layEvent === 'del'){ //删除
                layer.confirm('真的删除行么', function(index){
                    layer.close(index);
                    $.post("http://localhost:8888/industry/delete",{id:data.inid},function(d){
                        table.reload("userList",{
                            page:{
                                curr:1
                            }
                        });
                    });
                });
            }else if (layEvent === 'update'){//TODO 编辑

                $.get('update.html',function (datas) {
                    layer.open({
                        title: '编辑',
                        type:1,
                        anim:4,
                        skin:'layui-layer-molv',
                        area:'800px',
                        content:datas,
                        maxmin:true,
                        btn : ['确定','取消'],
                        success:function(){
                            data.locked = data.locked ==0 ? null :data.locked;
                            form.val('updateForm',data);
                        },
                        yes : function () {
                            var str = $("#update_user_form").serialize();
                            $.post(`${new Config().base_url}/industry/update`,str,function (data) {
                                layer.close(layer.index);
                                table.reload('userList');
                            });
                        }
                    });
                });
            } else if (layEvent === 'detail'){ //TODO 查看详情

            }
        });
    });
</script>
</body>
</html>